<template>
  <div>
    <template>
      <div class="overall-table-surround">
        <div class="overall-table-surround-options"></div>
        <div class="overall-table-surround-table">
          <el-table :data="pageData.list">
            <el-table-column prop="type" label="类型" width="60" align="center">
            </el-table-column>
            <el-table-column prop="type" label="用户名">
            </el-table-column>
            <el-table-column prop="create_date" label="邀请时间" width="140">
            </el-table-column>
            <el-table-column prop="expired_date" label="过期时间" width="140">
            </el-table-column>
          </el-table>
        </div>
      </div>
      <div class="overall-table-pagination">
        <div class="overall-table-pagination-left">
          <el-select v-model="pageData.limit" placeholder="请选择" size="mini">
            <el-option
              v-for="item in pageLimit"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </div>
        <div class="overall-table-pagination-right">
          <el-pagination
            background
            layout="prev, pager, next"
            :total="pageData.total"
          >
          </el-pagination>
        </div>
      </div>
    </template>
  </div>
</template>

<script>
import tableAttrMixin from "@/mixins/table_attr";
import ManageAPI from "@/api/manage";
export default {
  mixins: [tableAttrMixin],
  data() {
    return {
      userid: null,
      pageData: {
        page: 1,
        limit: 10,
        total: null,
        list: [],
      },
    };
  },
  created() {
    let { userid } = this.$route.query;
    this.userid = userid;
    this.getUserInviterList();
  },
  methods: {
    getUserInviterList() {
      let userid = this.userid;
      ManageAPI.getUserInviterList({ user: userid })
        .then((res) => {
          let { list, total } = res.data;
          this.pageData.list = list;
          this.pageData.total = total;
        })
        .catch((err) => {
          this.$message({
            message: err.msg,
            type: "error",
          });
        });
    },
  },
};
</script>

<style>
.secret {
  width: 200px;
  max-width: 200px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
</style>
